<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>系统参数列表</title>
    <style type="text/css">
        #searchDiv {
            width: 700px;
            font-size: 12px;
            padding-bottom: 10px;
        }

        #searchDiv input {
            width: 85%;
        }

        #listDiv {
            width: 700px;
        }

        #listDiv table {
            width: 100%;
            font-size: 12px;
        }
    </style>
    <script type="text/javascript" src="../../js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript">
        function loadSysparam() {
            var key = $("#keyword").attr("value");
            $.ajax({type:'get', url:'loadSystemParam.html', data:'key=' + key,success:function(data) {
                var tbody = jQuery("#listDiv table tbody");
                tbody.empty();
                $(data).find("param").each(function(){
                    var tr = document.createElement("tr");

                    var nameTd = document.createElement("td");
                    nameTd.innerHTML =  $(this).attr("name");
                    tr.appendChild(nameTd);

                    var statusTd = document.createElement("td");
                    var selectStatus = document.createElement("select");
                    var trueOpt = document.createElement("option");
                    trueOpt.innerHTML = "启用";
                    var falseOpt = document.createElement("option");
                    falseOpt.innerHTML = "禁用";
                    if ($(this).attr("status") == "0") {
                        trueOpt.selected = true;
                    } else {
                        falseOpt.selected = true;
                    }
                    selectStatus.appendChild(trueOpt);
                    selectStatus.appendChild(falseOpt);
                    statusTd.appendChild(selectStatus);
                    tr.appendChild(statusTd);

                    var valueTd = document.createElement("td");
                    valueTd.innerHTML =  $(this).attr("value");
                    tr.appendChild(valueTd);

                    var detailTd = document.createElement("td");
                    detailTd.innerHTML = $(this).attr("detail");
                    tr.appendChild(detailTd);

                    tbody.append(tr);
                });
            }});
        }

        window.addEventListener("load", loadSysparam, true);
    </script>
</head>
<body>

    <div id="wrap">
        <div id="searchDiv">
            <span>搜索：</span>
            <input type="text" id="keyword"/>
            <button onclick="loadSysparam();">确定</button>
        </div>
        <div id="listDiv">
            <table border="1px solid">
                <col width="15%">
                <col width="5%">
                <col width="30%">
                <col width="50%">
                <thead>
                    <tr>
                        <th>首选项名称</th>
                        <th>状态</th>
                        <th>值</th>
                        <th>说明</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>

</body>
</html>